$(function () {
    var currentPage = 1; // 记录当前页面 
    var pageSize = 4; // 每页条数 
    function fn() {
        $.ajax({
            type: 'get',
            url: '/user/queryUser',
            data: {
                pageSize: pageSize,
                page: currentPage
            },
            dataType: 'json',
            //请求成功时执行
            success: function (res) {
                console.log(res);
                // 渲染数据
                $("tbody").html(template("tmp", res))
                // 获取数据库总数，并传参调用页码函数
                setPage(res.total)
            },

        })
    }
    fn()

    var id = null; //用户id
    var isDelete = null; // 要进行操作 
    // 禁用，启用按钮(动态生成的按钮需要事件委托)
    $("tbody").on("click", ".btn-exec", function () {
        id = $(this).parent().attr("data-id")
        // console.log(id);
        //通过判断按钮的颜色来进行按钮的禁用和启用  禁用：0   启用：1
        isDelete = $(this).hasClass("btn-danger") ? 0 : 1
        // console.log(isDelete);
    })
    $(".btn-ok").click(function () {
        $.ajax({
            type: 'post',
            url: '/user/updateUser',
            data: {
                id: id,
                isDelete: isDelete
            },
            dataType: 'json',
            //请求成功时执行
            success: function (res) {
                // console.log(res);
                // 隐藏模态框
                $(".modal-user").modal("hide")
                // 重新渲染
                fn()
            },

        })
    })

    //  // 1-分页功能
    // 1- 获取数据库数据的总数，根据总数 推算出页码 （第一次交互的时候就获取到了total（数据库总是））

    // 2- 根据算出页码，生成对应的分页按钮（插件实现）
    function setPage(total) {
        // console.log(total);
        $("#paginator").bootstrapPaginator({
            bootstrapMajorVersion: 3,//默认是2，如果是bootstrap3版本，这个参数必填
            currentPage: currentPage,//默认按钮（当前页），
            totalPages: Math.ceil(total / pageSize),//总页数（分页个数）Math.ceil(向上取整)
            size: "small",//设置控件的大小，mini, small, normal,large
            onPageClicked: function (event, originalEvent, type, page) {
                console.log(page);//点击打印当前页码    
                //为按钮绑定点击事件 page:当前点击的按钮值，并且改变当前页的页码 
                currentPage = page
                // 切换当前页并且重新渲染
                fn()
            }

        });
    }
    // 3- 分页按钮个数，会根据数据的总数 变换而变化！，在渲染是时有total是局部变量，因此在渲染是调用setpage
}) 